<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>命令管理</title>
<%@include file="/jsp/include/common.jsp"%>
</head>
<body class="easyui-layout">
	<%@include file="/jsp/include/commonLayout.jsp"%>
	<div data-options="region:'center'">
		<div>
			<!-- 数据表格  -->
			<table id="treeGrid"></table>
			<!-- 添加或编辑命令的弹出窗口 begin -->
			<div id="saveOrEditDlg" class="easyui-dialog"
				style="width: 400px; height: 280px; padding: 10px 10px"
				closed="true" buttons="#dlg-buttons" data-options="modal:true">
				<form id="saveOrEditForm" method="post">
					<table>
						<tr>
							<td>命令名称:</td>
							<td><input name="oname" class="easyui-textbox"></td>
						</tr>
						<tr>
							<td>URL：</td>
							<td><input name="url" class="easyui-textbox"></td>
						</tr>
						<tr>
							<td>说明:</td>
							<td><input name="odesc" class="easyui-textbox"></td>
						</tr>
						<tr>
							<td>图标:</td>
							<td><input name="icon" class="easyui-textbox"></td>
						</tr>
						<tr>
							<td>父节点:</td>
							<td><input id="parentId" name="parent" class="easyui-textbox" data-options="readonly:true"></td>
						</tr>
					</table>
					<input type="hidden" name="oid"/>
				</form>
			</div>
			<div id="dlg-buttons">
				<a class="easyui-linkbutton" iconCls="icon-ok"
					onclick="cleanParentId()">清除父节点</a>
				<a class="easyui-linkbutton" iconCls="icon-ok"
					onclick="saveOrEditAction()">保存</a> 
				<a class="easyui-linkbutton" iconCls="icon-cancel"
					onclick="javascript:$('#saveOrEditDlg').dialog('close')">取消</a>
			</div>
			<!-- 添加或编辑命令的弹出窗口 end -->
		</div>
	</div>
</body>
<script type="text/javascript">
	$(document).ready(function() {
		// 初始化表格
		var treeGrid = $('#treeGrid').treegrid({
							rownumbers : true, //如果为true，则显示一个行号列
							fitColumns : true, //真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动
							collapsible : true, //定义是否显示可折叠按钮
							title : '命令管理', //在面板头部显示的标题文本
							method : 'post', //该方法类型请求远程数据
							nowrap : false, //如果为true，则在同一行中显示数据。设置为true可以提高加载性能。
							url : getRootPath() + '/ActionController/getActionList.do', //一个URL从远程站点请求数据
							singleSelect : false,//只能选一行
							striped : true, //数据条纹显示
							idField : 'id',//唯一标识列
							treeField:'oname',
							frozenColumns : [ [ {//不可被删除的列
								field : 'ck', //列字段名称
								checkbox : true
							//如果为true，则显示复选框
							} ] ],
							columns : [ [ {
								field : 'id',
								title : 'id',
								width : 100,
							}, {
								field : 'oname',
								title : '命令名称',
								width : 200
							},{
								field : 'url',
								title : '命令路径',
								width : 300
							}, {
								field : 'odesc',
								title : '说明',
								width : 200
							}, {
								field : 'icon',
								title : '图标',
								width : 200
							},{
								field : '_parentId',
								title : '父节点',
								width : 200
							},{
								field : 'sort',
								title : '排序',
								width : 200
							} ] ],
							toolbar : [
									{ //顶部工具栏的DataGrid面板
										text : '添加',
										iconCls : 'icon-add',
										handler : function() {
											$('#saveOrEditForm').form('clear');
											$('#parentId').textbox("readonly",true);
											var rows = $('#treeGrid').treegrid('getSelections');
											if (rows.length == 0) {
												$("#parentId").textbox("setText","");
												$("#parentId").textbox("setValue","");
											} else if (rows.length > 1) {
												$.messager.alert('提示','只能选择一项','info');
												return;
											}
											
											$('#saveOrEditDlg').dialog('open').dialog('setTitle','新建命令');
											$("#parentId").textbox("setText",rows[0].id);
											$("#parentId").textbox("setValue",rows[0].id);
										}
									},
									{
										text : '编辑',
										iconCls : 'icon-edit',
										handler : function() {
											var rows = $('#treeGrid').treegrid('getSelections');
											if (rows.length == 0) {
												$.messager.alert('提示','请选择修改项','info');
												return;
											} else if (rows.length > 1) {
												$.messager.alert('提示','只能选择一项','info');
												return;
											}
											var oid = rows[0].id;
											if (rows) {
												$('#saveOrEditDlg').dialog('open').dialog('setTitle','编辑命令');
												$.ajax({
															type : 'post',
															async : false,
															url : getRootPath() + '/ActionController/findActionById.do',
															data : {"oid":oid},
															success : function(result) {
																if(result!=null){
																	$('#saveOrEditForm').form('load',result);
																}
															},
															dataType : 'json'
														});
											}
										}
									},
									{
										text : '删除',
										iconCls : 'icon-remove',
										handler : function() {
											var rows = $('#treeGrid').treegrid('getSelections');
											if (rows.length == 0) {
												$.messager.alert('提示','请选择删除项','info');
												return;
											}

											var oids = [];
											for (var i = 0; i < rows.length; i++) {
												oids.push(rows[i].id);
											}

											oids = oids.join('-');
											
											$.messager.confirm('确认','确定要删除选中的信息吗?',
												function(r) {
													if (r) {
														//删除数据库中的数据之前一定要先删除页面的数据
														for (var i = 0; i < rows.length; i++) {
															$('#treeGrid').treegrid("remove",rows[i].id);
														}
														$.post(getRootPath() + '/ActionController/removeActionItems.do',
															{'oids' : oids},
															function(result) {
																//result = $.parseJSON(result);
																if (result.successful) {
																	$('#treeGrid').treegrid('reload'); // reload the user data
																}
																$.messager.show(result);
															},
															'json');
													}
											});
											$('#treeGrid').treegrid('clearSelections');
										}
									}, {
										text : '位置互换',
										iconCls : 'icon-reload',
										handler : function() {
											var rows = $('#treeGrid').treegrid('getSelections');
											if (rows.length != 2) {
												$.messager.alert('提示','请选择2个互换项','info');
												return;
											} 
											
											var first = rows[0];
											var second = rows[1];
											
											if (first._parentId != second._parentId) {
												$.messager.alert('提示','2个互换项必须是同一级别','info');
												return;
											}
											
											$.messager.confirm('确认互换项', '确认互换该选项', function(result){
												if (result){
													$.ajax({
														type : 'post',
														async : false,
														url : getRootPath() + '/ActionController/changeSort.do',
														data : {"firstId":first.id,"secondId":second.id},
														success : function(result) {
															if(result!=null){
																$('#treeGrid').treegrid('reload'); // reload the user data
															}
															$.messager.show(result);
														},
														dataType : 'json'
													});
												}
											});
											return false;
										}
									}]
						});

	});

	// 保存命令
	function saveOrEditAction() {
		$('#saveOrEditForm').form('submit', {
			url : getRootPath() + '/ActionController/saveActionItem.do',
			onSubmit : function() {
				return $(this).form('validate');
			},
			success : function(result) {
				result = $.parseJSON(result);
				if (result.successful) {
					$('#treeGrid').treegrid('reload'); // reload the user data
				}
				$('#saveOrEditDlg').dialog('close'); // close the dialog
				$.messager.show(result);
				$('#treeGrid').treegrid('clearSelections');
			}
		});
	}
	
	//清除父节点
	function cleanParentId(){
		$('#parentId').textbox("readonly",false);
		$('#parentId').textbox('clear');
	}
</script>
</html>
